<ion-view hide-tabs="true" hide-nav-bar="true" view-title="待使用" style="background-color: #F1F1F1;" ng-controller="unusedCtrl"
    ng-cloak>
    <ion-header-bar align-title="center" class="bar-default" style="background-color: #F8F8F8;">
        <div class="buttons">
            <button class="button" ng-click="backPrePage()"><span class="ion-ios-arrow-thin-left" style="font-size: 24px;"></span></button>
        </div>
        <h1 class="title">待使用</h1>
    </ion-header-bar>
    <ion-content>
        <ion-refresher pulling-text="下拉刷新" on-refresh="doRefresh()"></ion-refresher>
        <ion-list>
            <ion-item class="clearfix f12" style="border-left: none;border-right: none; position: relative" ng-repeat="item in toUse"
                ng-show="item.unusedFlag" ng-click="unusedDetail(item.id,item.aboutId,'{{item.type}}')">
                <div class="fl clearfix courseMemberMes">
                    <div></div>
                    <div class="courseMemberImg fl" style="background-image:url('{{item.pic}}');background-size: 100% 100%;"></div>
                    <ul class="fl " style="color: #999999;margin-left: 6px;">
                        <li class="clearfix ">
                            <h4 class="fl" ng-if="item.classType == 'group'">{{item.name}}</h4>
                            <h4 class="fl" ng-if="item.classType == 'charge'">{{item.product_name}}</h4>
                            <div class="courseMark fl"><span>{{item.courseFlag == true ? '私' : '团'}}</span></div>
                        </li>
                        <li ng-show="item.courseFlag">
                            <div><span>第{{item.course_num}}节</span>&emsp;<span>{{item.chargeName}}</span> </div>
                        </li>
                        <li>
                            教练：<span>{{item.coachName}}</span>
                        </li>
                        <li>
                            <div>开课时间: <span class="courseDate">{{item.class_date}}</span><span class="courseTime">{{item.start}}</span></div>
                        </li>
                    </ul>
                </div>
                <div class="fr courseState">
                    <div><span>待使用</span></div>
                    <div class="courseStateBotton"><span>已预约</span></div>
                </div>
            </ion-item>
            <ion-item ng-if="toUse == ''" style="text-align: center">
                您暂时没有课程
            </ion-item>
        </ion-list>
    </ion-content>
</ion-view>